<template>
	<view class="login">
		<view class="title">
			<view>欢迎登录小鹿前端</view>
		</view>
		<view class="form">
			<input type="text" v-model="username" placeholder="请输入用户名" />
			<input type="text" v-model="password" placeholder="请输入密码" />
		</view>
		<view class="btn">
			<button @tap="login">立即登录</button>
			<view class="tip">
				<text class="tip" @tap="goregister">没有账号，请先注册</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				username: "",
				password: ""
			}
		},
		methods: {
			login() {
				uniCloud.callFunction({
					name: "login",
					data: {
						username: this.username,
						password: this.password
					},
					success: (res) => {
						console.log(res);
						if (res.result.code == 200) {
							uni.showToast({
								title: "登录成功"
							})
							setTimeout(() => {
								uni.switchTab({
									url: "/pages/index/index"
								})
								uni.setStorageSync("user", res.result.msg)
							}, 2000)
						} else {
							uni.showToast({
								title: res.result.msg,
								icon: "none"
							})
						}
					}
				})
			},
			goregister() {
				uni.navigateTo({
					url: '/pages/register/register'
				})
			}
		}
	}
</script>

<style>
	.login {
		padding: 150rpx 40rpx 0;
		background-size: 100% 100%;
		height: 100vh;
	}

	.title {
		font-weight: bold;
		font-size: 40rpx;
	}
	.form{
		margin-top: 120rpx;
		
		input{
			border-bottom: 1px solid #d6d6d6;
			margin-bottom: 40rpx;
		}
	}
	.btn{
		margin-top: 100rpx;
		
		button{
			background-color: #007600;
			color: white;
		}
		.tip{
			text-align: right;
			color: #b9b9b9;
			margin-top: 20rpx;
		}
	}
</style>